<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="referrer" content="no-referrer" />
    <title>【Webpack的使用指南 01】Webpack入门 - 韩子卢 - 博客园</title>
    <link type="text/css" rel="stylesheet" href="https://www.cnblogs.com/css/blog-common.min.css">
    <link id="mobile-style" media="only screen and (max-width: 767px)" type="text/css" rel="stylesheet"
        href="https://www.cnblogs.com/skins/blank/bundle-blank-mobile.min.css">
    <link title="RSS" type="application/rss+xml" rel="alternate" href="http://www.cnblogs.com/vvjiang/rss">
    <link title="RSD" type="application/rsd+xml" rel="EditURI" href="http://www.cnblogs.com/vvjiang/rsd.xml">
    <link type="application/wlwmanifest+xml" rel="wlwmanifest" href="http://www.cnblogs.com/vvjiang/wlwmanifest.xml">
    <script src="https://cdn.bootcss.com/jquery/1.8.0/jquery.min.js"></script>
    <script type="text/javascript">
        var currentBlogApp = 'vvjiang', cb_enable_mathjax = false; var isLogined = true;
    </script>
</head>

<body>
    <a name="top"></a>
    <div id="page_begin_html">
        {{headerHtml}}
    </div>
    <!--done-->
    <div id="wrap">
        <div id="banner">
            <!--done-->
            <div class="header">
                <div class="headerText">
                    <a id="Header1_HeaderTitle" class="headermaintitle" href="http://www.cnblogs.com/vvjiang/"></a>
                    <br>
                </div>
                <div class="headerDis">风起于青萍之末，浪成于微澜之间</div>
            </div>
        </div>
        <div id="main">
            <!-- left starts -->
            <div id="left">
                <div id="mystats">
                </div>

                <div id="mylinks">
                    <!--done-->
                    <a id="blog_nav_sitehome" class="menu" href="/">博客园</a>&nbsp;&nbsp;
                    <a id="blog_nav_myhome" class="menu" href="/">首页</a>&nbsp;&nbsp;
                    <a id="blog_nav_newpost" class="menu" rel="nofollow" href="/">新随笔</a>&nbsp;&nbsp;
                    <a id="MyLinks1_NewArticleLink" class="menu" href="/">新文章</a>&nbsp;&nbsp;&nbsp;&nbsp;
                    <a id="blog_nav_admin" class="menu" rel="nofollow" href="/">管理</a>&nbsp;&nbsp;&nbsp;
                </div>
                <div id="topics">

                    <div id="post_detail">
                        <!--done-->
                        <div class="post">
                            <div class="postTitle">
                                <a id="cb_post_title_url" class="postTitle2"
                                    href="http://www.cnblogs.com/vvjiang/p/8567909.html">【Webpack的使用指南 01】Webpack入门</a>
                            </div>
                            <div id="cnblogs_post_body" class="blogpost-body cnblogs-markdown">
                                <h2 id="列表的样式">列表的样式</h2>
                                <ul>
                                    <li>列表示例1</li>
                                    <li>列表示例2</li>
                                    <li>列表示例3</li>
                                    <li>列表示例4</li>
                                </ul>
                                <h2 id="文本的样式">文本的样式</h2>
                                <p>
                                    <a href="https://github.com/jantimon/html-webpack-plugin">链接的效果</a>
                                </p>
                                <p>
                                    <strong>强调的效果</strong>
                                </p>
                                <p>短段落示例</p>
                                <p>
                                    这里是一个长的段落示例，主要用来查看段落换行后的效果。 这里是一个长的段落示例，主要用来查看段落换行后的效果。 这里是一个长的段落示例，主要用来查看段落换行后的效果。
                                    这里是一个长的段落示例，主要用来查看段落换行后的效果。 这里是一个长的段落示例，主要用来查看段落换行后的效果。
                                </p>


                                <p>这里演示p元素中存在换行的效果
                                    <br> 我是第二行
                                    <br> 我是第三行
                                    <br>
                                    我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行我是第四行
                                </p>
                                <h2 id="我是一个很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长的标题">
                                    我是一个很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长很长的标题</h2>
                                <p>下面是短的代码示例</p>
                                <pre><code class="hljs swift">npm <span class="hljs-keyword">init</span></code></pre>
                                <p>下面是长的代码示例</p>
                                <pre>
    <code class="hljs javascript"><span class="hljs-keyword">import</span> React <span class="hljs-keyword">from</span> <span class="hljs-string">'react'</span>
    <span class="hljs-keyword">import</span> { shallow } <span class="hljs-keyword">from</span> <span class="hljs-string">'enzyme'</span>
    <span class="hljs-keyword">import</span> CommentItem <span class="hljs-keyword">from</span> <span class="hljs-string">'./commentItem'</span>
                                                    
    describe(<span class="hljs-string">'测试评论列表项组件'</span>, () =&gt; {
    <span class="hljs-comment">// 这是mocha的玩法，jest可以直接兼容</span>
        it(<span class="hljs-string">'测试评论内容小于等于200时不出现展开收起按钮'</span>, () =&gt; {
              <span class="hljs-keyword">const</span> propsData = {
                date: <span class="hljs-string">'2018-03-04 10:10:11'</span>,
                name: <span class="hljs-string">'匿名人'</span>,
                content: <span class="hljs-string">'测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题'</span>
            }
            <span class="hljs-keyword">const</span> item = shallow(<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">CommentItem</span> {<span class="hljs-attr">...propsData</span>} /&gt;</span>)</span>
            <span class="hljs-comment">//看到这里的断言了吗，实际上和chai的expect是很像的</span>
            expect(item.find(<span class="hljs-string">'.btn-expand'</span>).length).toBe(<span class="hljs-number">0</span>);
        })
        <span class="hljs-comment">// 这是jest的玩法，推荐用这种</span>
        test(<span class="hljs-string">'两数相加结果为两个数字的和'</span>, () =&gt; {
            expect(<span class="hljs-number">3</span>).toBe(<span class="hljs-number">3</span>);
        });
     }</code>
</pre>

                                <h2 id="图片的样式">图片的样式</h2>
                                <p>图片包含在段落中的示例：
                                    <br>
                                    <img src="//upload-images.jianshu.io/upload_images/7197332-1680d40d6461f856.png"
                                        alt="项目结构">
                                </p>
                                <h2 id="表格样式">表格样式</h2>
                                <table>
                                    <thead>
                                        <tr class="header">
                                            <th>参数</th>
                                            <th align="center">作用</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr class="odd">
                                            <td>-p</td>
                                            <td align="center">对打包的文件进行压缩</td>
                                        </tr>
                                        <tr class="even">
                                            <td>-d</td>
                                            <td align="center">提供source map，方便调式代码</td>
                                        </tr>
                                        <tr class="odd">
                                            <td>--watch</td>
                                            <td align="center">监控源文件，如果源文件做了修改，那么立马生成新的打包文件</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div id="MySignature">
                                作者：韩子卢<br />
                                出处：https://www.cnblogs.com/vvjiang/<br />
                                本博客文章均为作者原创，转载请注明作者和原文链接。
                            </div>
                            <div class="clear"></div>
                            <div id="blog_post_info_block">
                                <div id="BlogPostCategory">分类:
                                    <a href="http://www.cnblogs.com/vvjiang/category/1178148.html"
                                        target="_blank">前端工程化</a>
                                </div>
                                <div id="EntryTag"></div>
                                <div id="blog_post_info">
                                    <div id="green_channel">
                                        <a href="javascript:void(0);" id="green_channel_digg"
                                            onclick="DiggIt(8607580,cb_blogId,1);green_channel_success(this,'谢谢推荐！');">好文要顶</a>
                                        <a id="green_channel_follow"
                                            onclick="follow('1bc8dc9c-d7e4-e411-b908-9dcfd8948a71');"
                                            href="javascript:void(0);">关注我</a>
                                        <a id="green_channel_favorite" onclick="AddToWz(cb_entryId);return false;"
                                            href="javascript:void(0);">收藏该文</a>
                                        <a id="green_channel_weibo" href="javascript:void(0);" title="分享至新浪微博"
                                            onclick="ShareToTsina()">
                                            <img src="//common.cnblogs.com/images/icon_weibo_24.png" alt="">
                                        </a>
                                        <a id="green_channel_wechat" href="javascript:void(0);" title="分享至微信"
                                            onclick="shareOnWechat()">
                                            <img src="//common.cnblogs.com/images/wechat.png" alt="">
                                        </a>
                                    </div>
                                    <div id="author_profile">
                                        <div id="author_profile_info" class="author_profile_info">
                                            <a href="http://home.cnblogs.com/u/vvjiang/" target="_blank">
                                                <img src="//pic.cnblogs.com/face/746209/20180314175910.png"
                                                    class="author_avatar" alt="">
                                            </a>
                                            <div id="author_profile_detail" class="author_profile_info">
                                                <a href="http://home.cnblogs.com/u/vvjiang/">韩子卢</a>
                                                <br>
                                                <a href="http://home.cnblogs.com/u/vvjiang/followees">关注 - 15</a>
                                                <br>
                                                <a href="http://home.cnblogs.com/u/vvjiang/followers">粉丝 - 58</a>
                                            </div>
                                        </div>
                                        <div class="clear"></div>
                                        <div id="author_profile_honor"></div>
                                        <div id="author_profile_follow">
                                        </div>
                                    </div>
                                    <div id="div_digg">
                                        <div class="diggit" onclick="votePost(8607580,'Digg')">
                                            <span class="diggnum" id="digg_count">7</span>
                                        </div>
                                        <div class="buryit" onclick="votePost(8607580,'Bury')">
                                            <span class="burynum" id="bury_count">0</span>
                                        </div>
                                        <div class="clear"></div>
                                        <div class="diggword" id="digg_tips">
                                        </div>
                                    </div>
                                    <script type="text/javascript">
                                        currentDiggType = 0;
                                    </script>
                                </div>
                                <div class="clear"></div>
                                <div id="post_next_prev">
                                    <a href="http://www.cnblogs.com/vvjiang/p/7836696.html" class="p_n_p_prefix">« </a>
                                    上一篇：
                                    <a href="http://www.cnblogs.com/vvjiang/p/7836696.html"
                                        title="发布于2017-11-15 02:04">【Chrome控制台】获取元素上绑定的事件信息以及监控事件</a>
                                    <br>
                                    <a href="http://www.cnblogs.com/vvjiang/p/8571983.html" class="p_n_p_prefix">» </a>
                                    下一篇：
                                    <a href="http://www.cnblogs.com/vvjiang/p/8571983.html"
                                        title="发布于2018-03-15 10:11">【Webpack的使用指南 02】Webpack的常用解决方案</a>
                                    <br>
                                </div>
                            </div>


                            <div class="postDesc">posted on
                                <span id="post-date">2018-03-14 15:28</span>
                                <a href="http://www.cnblogs.com/vvjiang/">韩子卢</a> 阅读(
                                <span id="post_view_count">153</span>) 评论(
                                <span id="post_comment_count">9</span>)
                                <a href="https://i.cnblogs.com/EditPosts.aspx?postid=8567909" rel="nofollow">编辑</a>
                                <a href="#" onclick="AddToWz(8567909);return false;">收藏</a>
                            </div>
                        </div>
                        <script src="//common.cnblogs.com/highlight/9.1.0/highlight.min.js?id=20160127"></script>
                    </div>
                    <a name="!comments"></a>
                    <div id="blog-comments-placeholder">
                        <div id="comment_pager_top"></div>
                        <!--done-->
                        <br>
                        <div class="feedback_area_title">发表评论</div>
                        <div class="feedbackNoItems"></div>


                        <div class="feedbackItem">
                            <div class="feedbackListSubtitle">
                                <div class="feedbackManage">
                                    &nbsp;&nbsp;
                                    <span class="comment_actions">
                                        <a href="javascript:void(0);"
                                            onclick="return ReplyComment(3923291,'KYW1DMOX84hWsPtsU7T6XQDtAfkFny7/9fIyMq8ZpBadgkmeL6q60g==')">回复</a>
                                        <a href="javascript:void(0);"
                                            onclick="return QuoteComment(3923291,'KYW1DMOX84hWsPtsU7T6XQDtAfkFny7/9fIyMq8ZpBadgkmeL6q60g==')">引用</a>
                                        <a href="javascript:void(0);"
                                            onclick="return DelComment(3923291,this, 8567909)">删除</a>
                                    </span>
                                </div>
                                <span class="comment_date">2018-03-15 09:36</span> |
                                <a id="a_comment_author_3923291" href="http://www.cnblogs.com/fuhai/"
                                    target="_blank">皮卡丘</a>
                                <a href="http://msg.cnblogs.com/send/%E6%B5%B7%E4%B9%8B%E6%AE%87" title="发送站内短消息"
                                    class="sendMsg2This">&nbsp;</a>
                            </div>
                            <div class="feedbackCon">
                                <div id="comment_body_3923291" class="blog_comment_body">最简单的评论</div>
                                <div class="comment_vote">
                                    <a href="javascript:void(0);" class="comment_digg"
                                        onclick="return voteComment(3923291,'Digg',this)">支持(1)</a>
                                    <a href="javascript:void(0);" class="comment_burry"
                                        onclick="return voteComment(3923291,'Bury',this)">反对(0)</a>
                                </div>
                                <span id="comment_3923291_avatar"
                                    style="display:none;">http://pic.cnblogs.com/face/797978/20161024093002.png</span>
                            </div>
                        </div>

                        <div class="feedbackItem">
                            <div class="feedbackListSubtitle">
                                <div class="feedbackManage">
                                    &nbsp;&nbsp;
                                    <span class="comment_actions">
                                        <a href="javascript:void(0);"
                                            onclick="return ReplyComment(3923298,'3ARucO/yPBfL6+sToAkDUr+U3MqlAikZmzFT2okWZ91R5zVxbYisHg==')">回复</a>
                                        <a href="javascript:void(0);"
                                            onclick="return QuoteComment(3923298,'3ARucO/yPBfL6+sToAkDUr+U3MqlAikZmzFT2okWZ91R5zVxbYisHg==')">引用</a>
                                        <a href="javascript:void(0);"
                                            onclick="return DelComment(3923298,this, 8567909)">删除</a>
                                    </span>
                                </div>
                                <span class="comment_date">2018-03-15 09:42</span> |
                                <a id="a_comment_author_3923298" href="http://www.cnblogs.com/liqingwen/"
                                    target="_blank">杰尼龟</a>
                                <a href="http://msg.cnblogs.com/send/%E5%8F%8D%E9%AA%A8%E4%BB%94" title="发送站内短消息"
                                    class="sendMsg2This">&nbsp;</a>
                            </div>
                            <div class="feedbackCon">
                                <div id="comment_body_3923298" class="blog_comment_body">这是一条带引用的评论 @皮卡丘
                                    <br>
                                    <fieldset class="comment_quote">
                                        <legend>
                                            <a href="#3923291" title="查看引用原文">引用</a>
                                        </legend>
                                        <br>最简单的评论
                                        <br>
                                    </fieldset>
                                </div>
                                <div class="comment_vote">
                                    <a href="javascript:void(0);" class="comment_digg"
                                        onclick="return voteComment(3923298,'Digg',this)">支持(0)</a>
                                    <a href="javascript:void(0);" class="comment_burry"
                                        onclick="return voteComment(3923298,'Bury',this)">反对(0)</a>
                                </div>
                                <span id="comment_3923298_avatar"
                                    style="display:none;">http://pic.cnblogs.com/face/711762/20160911213130.png</span>
                            </div>
                        </div>

                        <div class="feedbackItem">
                            <div class="feedbackListSubtitle">
                                <div class="feedbackManage">
                                    &nbsp;&nbsp;
                                    <span class="comment_actions">
                                        <a href="javascript:void(0);" onclick="return GetCommentBody(3923362)">修改</a>
                                        <a href="javascript:void(0);"
                                            onclick="return DelComment(3923362,this, 8567909)">删除</a>
                                    </span>
                                </div>
                                <span class="comment_date">2018-03-15 10:21</span> |
                                <a id="a_comment_author_3923362" href="http://www.cnblogs.com/vvjiang/"
                                    target="_blank">韩子卢</a>
                                <a href="http://msg.cnblogs.com/send/%E9%9F%A9%E5%AD%90%E5%8D%A2" title="发送站内短消息"
                                    class="sendMsg2This">&nbsp;</a>
                            </div>
                            <div class="feedbackCon">
                                <div id="comment_body_3923362" class="blog_comment_body">
                                    <a href="#3923291" title="查看所回复的评论"
                                        onclick="commentManager.renderComments(0,50,3923291);">@</a>
                                    皮卡丘
                                    <br>这里是@某个人的评论</div>
                                <div class="comment_vote">
                                    <a href="javascript:void(0);" class="comment_digg"
                                        onclick="return voteComment(3923362,'Digg',this)">支持(0)</a>
                                    <a href="javascript:void(0);" class="comment_burry"
                                        onclick="return voteComment(3923362,'Bury',this)">反对(0)</a>
                                </div>
                                <span id="comment_3923362_avatar"
                                    style="display:none;">http://pic.cnblogs.com/face/746209/20180314175910.png</span>
                            </div>
                        </div>
                        <div id="comment_pager_bottom"></div>
                    </div>
                    <div id="comment_form" class="commentform">
                        <a name="commentform"></a>
                        <div id="divCommentShow">
                            <div class="comment_my_posted">
                                <img style="vertical-align:middle" src="//static.cnblogs.com/images/icon_comment.gif">
                                <a href="http://home.cnblogs.com/u/746209/">
                                    <b>韩子卢</b>
                                </a>:
                                <blockquote class="bq_post_comment">
                                    <a href="#3923384" title="查看所回复的评论"
                                        onclick="commentManager.renderComments(0,50,3923384);">@</a>
                                    皮卡丘
                                    <br>这是发送完状态的评论</blockquote>
                            </div>
                        </div>
                        <div id="comment_nav">
                            <span id="span_refresh_tips"></span>
                            <a href="javascript:void(0);" onclick="return RefreshCommentList();"
                                id="lnk_RefreshComments" runat="server" clientidmode="Static">刷新评论</a>
                            <a href="#" onclick="return RefreshPage();">刷新页面</a>
                            <a href="#top">返回顶部</a>
                        </div>
                        <div id="comment_form_container">
                            <div id="commentform_title">发表评论</div>
                            <span id="tip_comment" style="color:Red">感谢您的回复:) 服务器端执行耗时1899毫秒</span>
                            <p>
                                昵称：
                                <input type="text" id="tbCommentAuthor" class="author" disabled="disabled" size="50"
                                    value="韩子卢">
                            </p>
                            <div class="commentbox_main">
                                <div class="commentbox_title">
                                    <div class="commentbox_title_left">评论内容：</div>
                                    <div class="commentbox_title_right">
                                        <img id="ubb_quote" class="comment_icon"
                                            src="//static.cnblogs.com/images/ubb/quote.gif" alt="引用" title="添加引用"
                                            onclick="insertUBB('tbCommentBody','quote')">
                                        <img id="ubb_bold" class="comment_icon"
                                            src="https://static.cnblogs.com/images/ubb/b.png" alt="粗体" title="添加粗体"
                                            onclick="insertUBB('tbCommentBody','b')">
                                        <img id="ubb_url" class="comment_icon"
                                            src="//static.cnblogs.com/images/ubb/lk.png" alt="链接" title="添加链接"
                                            onclick="insertUbbUrl('tbCommentBody')">
                                        <img id="ubb_indent" class="comment_icon"
                                            src="//static.cnblogs.com/images/ubb/indent.png" alt="缩进" title="添加首行缩进"
                                            onclick="insertIndent('tbCommentBody')">
                                        <img id="ubb_code" class="comment_icon"
                                            src="//static.cnblogs.com/images/ubb/InsertCode.gif" alt="代码" title="添加代码"
                                            onclick="insertUbbCode()">
                                        <img id="ubb_img" class="comment_icon"
                                            src="//static.cnblogs.com/images/ubb/img.gif" alt="图片" title="上传图片"
                                            onclick="OpenImageUploadWindow();">
                                    </div>
                                </div>
                                <div class="clear"></div>
                                <textarea id="tbCommentBody" class="comment_textarea"></textarea>
                                <ul class="typeahead dropdown-menu"
                                    style="top: 16045.3px; left: 282.5px; display: none;">
                                    <li class="active">
                                        <a href="#">
                                            <img class="mention_image"
                                                src="//pic.cnblogs.com/face/544734/20170517140159.png">
                                            <b class="mention_name">tongling</b>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <p id="commentbox_opt">
                                <input id="btn_comment_submit" type="button" class="comment_btn" value="提交评论">
                                <span id="span_comment_canceledit" style="display:none">
                                    <a href="javascript:void(0);" onclick="return CancelCommentEdit()">不改了</a>
                                </span>
                                <a href="javascript:void(0);" onclick="return logout();">退出</a>
                            </p>
                            <div id="tip_comment2" style="color:Red">感谢您的回复:) 服务器端执行耗时1899毫秒</div>
                            <p>
                                [Ctrl+Enter快捷键提交]
                            </p>
                            <div style="display:none">
                                <span id="comment_edit_id"></span>
                                <span id="span_parentcomment_id">3923384</span>
                                <span id="span_parent_id"></span>
                                <span
                                    id="span_comment_replyto">debg5NlAM4XWljHSt6jjsOZR0DUm8BCZz14VryMyKATabAyGxF2tKA==</span>
                                <span id="span_comment_posted"></span>
                            </div>
                        </div>
                        <div class="ad_text_commentbox" id="ad_text_under_commentbox"></div>
                        <div id="ad_t2">
                            <a href="http://www.ucancode.com/index.htm" target="_blank">【推荐】超50万VC++源码:
                                大型组态工控、电力仿真CAD与GIS源码库！</a>
                            <br>
                            <a href="http://click.aliyun.com/m/43774/" target="_blank">【缅怀】传奇谢幕，回顾霍金76载传奇人生</a>
                            <br>
                            <a href="https://cloud.tencent.com/act/campus?fromSource=gwzcw.860539.860539.860539"
                                target="_blank">【推荐】腾讯云校园拼团福利，1核2G服务器10元/月！</a>
                            <br>
                            <a href="https://www.yunqi2050.com/#/index" target="_blank">【活动】2050 科技公益大会 - 年青人因科技而团聚</a>
                            <br>
                        </div>
                        <div id="opt_under_post"></div>
                        <div id="cnblogs_c1" class="c_ad_block">
                            <a href="https://market.qcloud.com/act/wangjian/?fromSource=gwzcw.860541.860541.860541"
                                target="_blank">
                                <img width="300" height="250"
                                    src="https://images2018.cnblogs.com/news/24442/201803/24442-20180314220122373-1718033865.jpg"
                                    alt="qcloud0314">
                            </a>
                        </div>
                        <div id="under_post_news">
                            <div class="itnews c_ad_block">
                                <b>最新IT新闻</b>:
                                <br> ·
                                <a href="https://news.cnblogs.com/n/591862/" target="_blank">“3·15”前夕 仍有在线旅游网站搭售保险</a>
                                <br> ·
                                <a href="https://news.cnblogs.com/n/591861/" target="_blank">马斯克不碰证券和加密货币 只投资自己的公司</a>
                                <br> ·
                                <a href="https://news.cnblogs.com/n/591860/" target="_blank">机构：加密货币给英伟达带来的增长明显放缓</a>
                                <br> ·
                                <a href="https://news.cnblogs.com/n/591859/"
                                    target="_blank">携程2017年全年营收41亿美元，同比增长39%</a>
                                <br> ·
                                <a href="https://news.cnblogs.com/n/591858/" target="_blank">员工爆料称生产过程中40%零部件需返工
                                    特斯拉回应</a>
                                <br>»
                                <a href="http://news.cnblogs.com/" title="IT新闻" target="_blank">更多新闻...</a>
                            </div>
                        </div>
                        <div id="cnblogs_c2" class="c_ad_block">
                            <a href="http://click.aliyun.com/m/42835/" target="_blank">
                                <img width="468" height="60"
                                    src="https://gw.alicdn.com/tfs/TB1mEZFaWmWBuNjy1XaXXXCbXXa-468-60.jpg"
                                    alt="阿里云0308">
                            </a>
                        </div>
                        <div id="under_post_kb">
                            <div class="itnews c_ad_block" id="kb_block">
                                <b>最新知识库文章</b>:
                                <br>
                                <div id="kb_recent"> ·
                                    <a href="http://kb.cnblogs.com/page/575255/" target="_blank">写给自学者的入门指南</a>
                                    <br> ·
                                    <a href="http://kb.cnblogs.com/page/578690/" target="_blank">和程序员谈恋爱</a>
                                    <br> ·
                                    <a href="http://kb.cnblogs.com/page/585734/" target="_blank">学会学习</a>
                                    <br> ·
                                    <a href="http://kb.cnblogs.com/page/588938/" target="_blank">优秀技术人的管理陷阱</a>
                                    <br> ·
                                    <a href="http://kb.cnblogs.com/page/590141/" target="_blank">作为一个程序员，数学对你到底有多重要</a>
                                    <br>
                                </div>»
                                <a href="http://kb.cnblogs.com/" target="_blank">更多知识库文章...</a>
                            </div>
                        </div>
                        <div id="HistoryToday" class="c_ad_block">
                            <b>历史上的今天:</b>
                            <br>2016-03-14
                            <a href="http://www.cnblogs.com/vvjiang/p/5277535.html">【C#进阶系列】11 事件</a>
                            <br>
                        </div>
                    </div>


                </div>
                <br>
                <br>
                <br>
            </div>
            <!-- left ends -->
            <!-- right starts -->
            <div id="right">
                <!-- 右侧工具部分 -->
                <div id="right_content">

                    <div id="calendar">
                        <div id="blog-calendar" style="display:none"></div>
                    </div>

                    <div id="leftcontentcontainer">
                        <div id="blog-sidecolumn">
                            <div id="sidebar_search" class="sidebar-block"></div>
                            <div id="sidebar_categories">
                                <!--done-->

                                <h1 class="catListTitle">随笔分类</h1>

                                <ul class="catList">

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_0" class="listitem"
                                            href="/categoryList.html">AngularJS学习笔记(3)</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_1" class="listitem"
                                            href="/categoryList.html">Bootstrap基础学习(6)</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_2" class="listitem"
                                            href="/categoryList.html">C#进阶系列(31)</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_3" class="listitem"
                                            href="/categoryList.html">JavaScript复习(8)</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_4" class="listitem"
                                            href="/categoryList.html">jQuery基础学习(13)</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_5" class="listitem"
                                            href="/categoryList.html">MVC拾遗(1)</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_6" class="listitem"
                                            href="/categoryList.html">开发工具(2)</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_7" class="listitem"
                                            href="/categoryList.html">浏览器机制</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_8" class="listitem"
                                            href="/categoryList.html">前端工程化(2)</a>
                                    </li>

                                    <li class="catListItem">
                                        <a id="CatList_LinkList_0_Link_9" class="listitem"
                                            href="/categoryList.html">重构(13)</a>
                                    </li>

                                </ul>


                            </div>
                        </div>
                    </div>

                </div>
                <!-- //右侧工具部分 -->
                <div id="footer">

                    Copyright ©2018 韩子卢
                </div>
            </div>
            <!-- right ends -->
        </div>
    </div>
    <div id="page_end_html">
        {{footerHtml}}
    </div>
</body>
</html>